<template>
  <div class="native">
    <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
        prop="type"
        label="类型">
      </el-table-column>
      <el-table-column
        prop="password"
        label="密码">
      </el-table-column>
      <el-table-column
        prop="link"
        label="地址">
        <template scope="scope">
          <el-button @click="handleClick(scope.$index)" type="text" size="small">打开地址</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
  export default {
    name: 'index',
    components: {
    },
    data () {
      return {
        tableData: [{
          type: 'iOS客户端',
          password: 'yaolai',
          link: 'https://www.pgyer.com/yaolaicustomer'
        }, {
          type: 'Android客户端',
          password: 'yaolai',
          link: 'https://www.pgyer.com/SrOline'
        }]
      }
    },
    mounted () {
    },
    methods: {
      handleClick (index) {
        window.open(this.tableData[index].link)
      }
    }
  }
</script>
<style lang="less" scoped>
.native {
  font-size: 26px;
  line-height: 1.5;
  label {
    width: 100px;
    display: inline-block;
  }
}
</style>